<template>
    <div class="child">
        <h2>我是子组件1</h2>
        <h4>玩具：{{ toy }}</h4>
        <button @click="sendToy">给child1发送数据</button>
    </div>
</template>

<script lang="ts" setup name="Child">
import {ref} from "vue";
import emitter from "@/utils/emitter";

let toy = ref('奥特曼')

function sendToy() {
    // 发送数据，需要触发事件
    emitter.emit('save-toy', toy.value)
}
</script>

<style scoped>
.child {
    float: left;
    margin-left: 15px;
    height: 300px;
    width: 40%;
    background-color: aliceblue;
}
</style>
